<template>
    <p>第{{$route.params.id}}周</p>
    <p>学习内容:{{course.content}}</p>
    <p>课后作业:{{course.homework}}</p>
</template>
<script>
export default({
    data(){
        return{
            course:{}
        }
    },
    created(){
        let lesson=[
                {id:1,content:"vue简介与第一个vue程序",homework:"vue中进行页面输出的方式有哪些"},
                {id:2,content:"vfor",homework:"送你一朵小红花"},
                {id:3,content:"计算属性与监听器",homework:"无"}, 
                {id:4,content:"生命周期及父组件向子组件传值",homework:"父组件向子组件传递多个值"},
                {id:5,content:"组件上使用vmodel",homework:"送你一朵小红花-v2.0"},
            ]
        this.course = lesson.find((i)=>i.id == this.$route.params.id)
    },
    watch:{
        $route(){
            let lesson=[
                {id:1,content:"vue简介与第一个vue程序",homework:"vue中进行页面输出的方式有哪些"},
                {id:2,content:"vfor",homework:"送你一朵小红花"},
                {id:3,content:"计算属性与监听器",homework:"无"}, 
                {id:4,content:"生命周期及父组件向子组件传值",homework:"父组件向子组件传递多个值"},
                {id:5,content:"组件上使用vmodel",homework:"送你一朵小红花-v2.0"},
            ]
            this.course = lesson.find((i)=>i.id == this.$route.params.id)
        }
    }
})
</script>
<style scoped>
p{
    text-align: left;
}
</style>